<template>
	<view>
		<!--pages/student/student.wxml-->
		<view class="title">
			<text>全部学生</text>
		</view>
		<view class="container">
			<view class="line">
				<view class="left">{{student1}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>
			<view class="line">
				<view class="left">{{student2}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>
			<view class="line">
				<view class="left">{{student3}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>
			<view class="line">
				<view class="left">{{student4}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>
			<view class="line">
				<view class="left">{{student5}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>
			<view v-for="(item, index) in 10" :key="index" class="line">
				<view class="left">{{student6}}</view>
				<view class="right" @click="jumpToAttend()">查看考勤</view>
			</view>


		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				student1: "罗晓明",
				student2: "李佳佳",
				student3: "赵小荣",
				student4: "林默默",
				student5: "宋丹青",
				student6: "洪浩"
			};
		},

		components: {},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			jumpToAttend: function(){
				uni.navigateTo({
					url:"../attendRecord/attendRecord"
				})
			}
		}
	};
</script>
<style>
	/* pages/student/student.wxss */
	.title {


		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: left;
	}

	.title image {
		height: 82rpx;
		width: 82rpx;
	}

	.title text {
		color: #FD973F;
		font-size: 16px;
		margin: 5%;
	}

	.container {
		padding: 0 4vw;
		border-radius: 5vw;
		width: 100%;
		background: white;
	}

	.line {
		width: 100%;
		margin: 8px;
		display: flex;
		flex-direction: row;
		border-bottom: 1rpx solid #E0E3DA;
	}

	.container .left {
		width: 50%;
		font-size: 16px;
	}

	.container .right {
		width: 40%;
		text-align: right;
		color: #FF9400;
		font-size: 16px;
	}
</style>
